import { sysProfile, sysuser } from '@/api/user'
import router, { constantRoutes, otherRouters } from '@/router'

const state = {
  token: '',
  userPro: ''
}

const mutations = {

  // 存储token
  SET_TOKEN(state, value) {
    state.token = value
  },
  // 个人信息
  ccsuerxx(state, x) {
    state.userPro = x
  },

  // 删除信息
  delesgrxx(state) {
    state.userPro = ''
    state.token = ''

    // 每次点击退出都会用到这个，所以重置路由就写在这
    // resetRouter()
  }
}

const actions = {

  async yhjbxx(context) {
    const res = await sysProfile()
    const res2 = await sysuser(res.data.data.userId)
    // 利用请求俩个接口得到完整的数据/合并到vuex
    // 对象合并   俩种写法
    // const res3 = { ...res, ...res2 }
    const res3 = Object.assign({}, res.data.data, res2.data.data)
    console.log(res2)

    context.commit('ccsuerxx', res3)

    // 导入动态路由匹配账号信息存储的权限标识
    const xinotherRouters = otherRouters.filter(v => {
      return res3.roles.menus.includes(v.meta.name)
    })

    // 在当前项目中可以看到,侧边栏是在layout中的sidebar中的index
    //  <sidebar-item v-for="route in routes" :key="route.path" :item="route" :base-path="route.path" />
    // 是通过这个来渲染的,可以看出计算机计算机属性中,返回了一个方法
    /*

     routes() {
      return this.$router.options.routes
    },

    是通过this.$router.options.routes来渲染菜单栏

    */
    console.log(xinotherRouters, 11111111111)

    // 刷新条404，将重定向添加到动态路由 { path: '*', redirect: '/404', hidden: true }
    xinotherRouters.push({ path: '*', redirect: '/404', hidden: true })

    // 添加路由
    router.addRoutes(xinotherRouters)
    // 添加完后发现路由用上了,但是菜单没用上
    // 打印router,可以发现router.options.routes字段拿到了路由配置

    // 虽然没更新但是可以自己手动更新
    // router.options.routes = [静态路由, 加动态路由]
    router.options.routes = [...constantRoutes, ...xinotherRouters]

    console.log(router.options.routes)

    // 正常addRoutes添加,router.options.routes是正常更新的,证明了有缺陷
    //     不是立马生效(路由是已经添加了(可以访问)，但是没有生效，刷新数据就跳404)，是再经过导航守卫才生效
    //     第一次先获取用户信息后，拿到权限数据后做匹配，在添加(所以第一次没有经过导航守卫)
    //  解决方案
    //     1.刷新跳404，将重定向添加到动态路由 { path: '*', redirect: '/404', hidden: true }
    //     2.再路由守卫，获取用户信息是将跳转为刷新前路径   next(to.path)
    //        携带参数  其实to包含了参数直接写即可   next(to)
  }

}

export default {
  namespaced: true,
  state,
  mutations,
  actions

}
